<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta name="author" content="李金波">
	<link rel="icon" href="./set_password.ico">
	<link rel="stylesheet" href="./index.css">
	<title>随机密码</title>
</head>

<body>
	<div class="container-max">
		<!-- 选择密码位数 -->
		<div class="redio-max mb30">
			<form name="selectfrom">
				<label>
					<div class="radio-item">
						<input name="radioitem" type="radio" value="12" checked />
						<div>12位</div>
					</div>
				</label>
				<label>
					<div class="radio-item">
						<input name="radioitem" type="radio" value="16" />
						<div>16位</div>
					</div>
				</label>
				<label>
					<div class="radio-item">
						<input name="radioitem" type="radio" value="20" />
						<div>20位</div>
					</div>
				</label>
				<label>
					<div class="radio-item">
						<input name="radioitem" type="radio" value="0" />
						<div>自定义位数</div>
						<input name="text" type="text" value="32" />
					</div>
				</label>
			</form>
		</div>
		<!-- 选择密码字符集 -->
		<div class="gradeform-max mb30">
			<form name="gradeform">
				<label>
					<input type="checkbox" name="grade" value="A" checked />
					<span>数字</span>
				</label>
				<label>
					<input type="checkbox" name="grade" value="B" checked />
					<span>小写</span>
				</label>
				<label>
					<input type="checkbox" name="grade" value="C" checked />
					<span>大写</span>
				</label>
				<label>
					<input type="checkbox" name="grade" value="D" />
					<span>符号</span>
				</label>
			</form>
		</div>
		<!-- 复制按钮 -->
		<div class="copy-but-max mb30 ac">
			<button class="but create" onclick="createPassword()" type="button">生成</button>
			<button class="but copy" onclick="copyResult()" type="button">复制</button>
		</div>
		<!-- 结果展示 -->
		<div id="result-text"></div>
		<!-- 提示弹窗 -->
		<div id="dialog" class="mask_max jac" style="display: none;">
			<div class="content_max">
				<div class="tips_title jac">提示</div>
				<div id="showContent" class="tips_content_box jac"></div>
				<div class="foot_but_max ac">
					<!-- <div id="tipsCancel" class="cancel jac">取消</div> -->
					<div id="tipsConfirm" class="confirm jac">确认</div>
				</div>
			</div>
		</div>

		<!-- 生成历史 -->
		<ol id="createdHistory"></ol>
	</div>
	<script src="./main.js"></script>
</body>

</html>